
<!-- The image page, refer to static/js/controller -->
<div>

  <span class="page-header">
    <!-- Display image title and the JSON link -->
    <h1 class="page-header-left">{{'image'|translate}} <a ng-href="{{canonicalServer}}/images/{{image.Id}}/json" target="_blank"><img src="static/img/json-logo.png" height="32"></a></h1>
  </span> <!-- End of page header -->

  <!-- Alert if we get nothing from server -->
  <div ng-show="!image" class="alert alert-danger" role="alert">{{'no_such_image'|translate}}</div>

  <!-- Display image information -->
  <table class="table table-striped table-hover">
    <thead>
      <tr>
        <th>{{'attribute'|translate}}</th>
        <th>{{'value'|translate}}</th>
      </tr>
    </thead>

    <tbody>
      <tr>
        <td>{{'id'|translate}}</td>
        <td>{{image.Id | limitTo:12}}</td> <!-- Shorten image id -->
      </tr>

      <tr>
        <td>{{'author'|translate}}</td>
        <td>{{image.Author}}</td>
      </tr>

      <tr>
        <td>{{'architecture'|translate}}</td>
        <td>{{image.Architecture}}</td>
      </tr>

      <tr>
        <td>{{'comment'|translate}}</td>
        <td>{{image.Comment}}</td>
      </tr>

      <tr>
        <td>{{'created'|translate}}</td>
        <td>{{image.Created}}</td>
      </tr>

      <tr>
        <td>{{'dockerversion'|translate}}</td>
        <td>{{image.DockerVersion}}</td>
      </tr>

      <tr>
        <td>{{'os'|translate}}</td>
        <td>{{image.Os}}</td>
      </tr>

      <tr>
        <td>{{'parent'|translate}}</td>
        <td>{{image.Parent | limitTo:12}}</td>
      </tr>

      <tr>
        <td>{{'size'|translate}}</td>
        <td>{{image.Size}}</td>
      </tr>
  </table>

</div> <!-- End of this angular page -->
